<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script src="js/mui.min.js"></script>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link href="css/main.css" rel="stylesheet" />
		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>
		<style type="text/css">
			.mui-table-view-cell{
				padding: 10px 15px;
			}
			.mui-ellipsis{ 
				line-height: 42px;
				color: #343434;
				font-size: 20px;
				/* color: #343434;
				font-size: 20px;
				line-height: 42px; */
			}
		</style>
		<style>
			@font-face {
			font-family: 'iconfont';
			src: url('iconfont/iconfont.eot');
			src: url('iconfont/iconfont.eot?#iefix') format('embedded-opentype'),
			url('iconfont/iconfont.woff2') format('woff2'),
      url('iconfont/iconfont.woff') format('woff'),
      url('iconfont/iconfont.ttf') format('truetype'),
      url('iconfont/iconfont.svg#iconfont') format('svg');
}
.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.mui-pull-left{border: solid 2px #EEEEEE ;border-radius:50%}
.xjb-Authentication{position: absolute;top: 104px;left: 37px;z-index: 20;} 
.mui-table-view .mui-media-object{max-width: 94px;height: 94px;}
.mui-btn-success{border: 1px solid #67B701;background-color: #67B701;}
.mui-badge-danger{border: solid 1px #FFFFFF ;background-color: #FA1212;}
.mui-badge-success{border: solid 1px #FFFFFF ;background-color: #67B701;}
.mui-xjb-Occupation .mui-badge{background-color: auto ;}
.mui-media-body b{color: #67B701;font-weight:normal}
.mui-table-view-cell{padding: 18px 15px;}
		</style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav">
			<h1 class="mui-title">乡建帮</h1>
		</header>
		<!-- <div class="mui-content">
		<ul class="mui-table-view">
			<li class="mui-table-view-cell mui-media">
				<a class="mui-navigate-right" href="javascript:;">
					<img class="mui-media-object mui-pull-left" src="image/personal-icon01.png">
					<p class="mui-ellipsis">个人信息</p>
				</a>
				<li class="mui-table-view-cell mui-media">
					<a class="mui-navigate-right" href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="image/personal-icon02.png">
						<p class="mui-ellipsis">我的订单</p>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a  class="mui-navigate-right" href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="image/personal-icon03.png">
						<p class="mui-ellipsis">我的消息</p>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a  class="mui-navigate-right" href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="image/personal-icon04.png">
						<p class="mui-ellipsis">用户协议</p>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a  class="mui-navigate-right" href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="image/personal-icon05.png">
						<p class="mui-ellipsis">使用帮助</p>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a  class="mui-navigate-right" href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="image/personal-icon06.png">
						<p class="mui-ellipsis">我的客服</p>
					</a>
				</li>
			</li>
		</ul>
		</div> -->
		<div class="mui-content">
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						<div>
						<img class="mui-media-object mui-pull-left" src="image/1.jpg">
						<span class="mui-badge mui-badge-success xjb-Authentication">已认证</span>
						</div>
						<div class="mui-media-body">
							<b>张小样</b>
						<div style="margin-top: 14px;">
							<span class="mui-badge">建筑专业设计师</span>
							<span class="mui-badge">结构专业设计师</span>
						</div>
							<div style="margin-top: 16px;">
								<span class="mui-btn mui-btn-success">
					立即预约
				</span>
				<span class="mui-btn mui-btn-success">
					查看详情
				</span>
							</div>
						</div>
					</a>
				</li>
			</ul>
			<div style="height: 16px;"></div>
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						
						<div>
						<img class="mui-media-object mui-pull-left" src="image/1.jpg">
						<span class="mui-badge mui-badge-danger xjb-Authentication">未认证</span>
						</div>
						<div class="mui-media-body">
							<b>张小样</b>
						<div style="margin-top: 14px;">
							<span class="mui-badge">建筑专业设计师</span>
							<span class="mui-badge">结构专业设计师</span>
						</div>
							<div style="margin-top: 16px;">
								<span class="mui-btn mui-btn-success">
					立即预约
				</span>
				<span class="mui-btn mui-btn-success">
					查看详情
				</span>
							</div>
							<!-- <p class="mui-ellipsis">能和心爱的人一起睡觉，是件幸福的事情；可是，打呼噜怎么办？</p> -->
						</div>
					</a>
				</li>
			</ul>
			<div style="height: 16px;"></div>
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						<div>
						<img class="mui-media-object mui-pull-left" src="image/1.jpg">
						<span class="mui-badge mui-badge-success xjb-Authentication">已认证</span>
						</div>
						<div class="mui-media-body">
							<b>张小样</b>
						<div style="margin-top: 14px;">
							<span class="mui-badge">建筑专业设计师</span>
							<span class="mui-badge">结构专业设计师</span>
						</div>
							<div style="margin-top: 16px;">
								<span class="mui-btn mui-btn-success">
					立即预约
				</span>
				<span class="mui-btn mui-btn-success">
					查看详情
				</span>
							</div>
							<!-- <p class="mui-ellipsis">能和心爱的人一起睡觉，是件幸福的事情；可是，打呼噜怎么办？</p> -->
						</div>
					</a>
				</li>
			</ul>
		</div>
		<nav class="mui-bar mui-bar-tab">
			<a class="mui-tab-item mui-active">
				<span class="mui-icon mui-icon-home "></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a class="mui-tab-item">
				<span class="mui-icon iconfont">&#xe608;</span>
				<span class="mui-tab-label">我的订单</span>
			</a>
			<a class="mui-tab-item">
				<span class="mui-icon iconfont">&#xe656;</span>
				<span class="mui-tab-label">个人中心</span>
			</a>
		</nav>
	</body>
</html>
